<template>
  <div>
    <Nav />
    <div class="box">
      <div class="box_item">
        <el-card class="bi_card">
          <div class="bic_t bic_t_ss_bg">新建流程 - 实施方案</div>
          <div class="bic_b">
            <div class="bic_b_c" @click="$router.push({path: '/create-embodiment'})">
              <div class="bi_icon">
                <img class="bi_icon_img" src="../../assets/images/shishiIcon.png">
              </div>
              <div class="bi_tit">
                <div class="bi_tit_1">实施方案</div>
                <div class="bi_tit_2">新建实施方案</div>
              </div>
            </div>
          </div>
        </el-card>
      </div>
      <div class="box_item">
        <el-card class="bi_card">
          <div class="bic_t bic_t_sj_bg">新建流程 - 设计方案</div>
          <div class="bic_b">
            <div class="bic_b_c" @click="$router.push({path: '/create-designing'})">
              <div class="bi_icon">
                <img class="bi_icon_img" src="../../assets/images/shejiIcon.png">
              </div>
              <div class="bi_tit">
                <div class="bi_tit_1">设计方案</div>
                <div class="bi_tit_2">新建设计方案</div>
              </div>
            </div>
          </div>
        </el-card>
      </div>
      <div class="box_item">
        <el-card class="bi_card">
          <div class="bic_t bic_t_ztb_bg">新建流程 - 招投标方案</div>
          <div class="bic_b">
            <div class="bic_b_c" @click="$router.push({path: '/create-bidding'})">
              <div class="bi_icon">
                <img class="bi_icon_img" src="../../assets/images/zhaotoubiaoIcon.png">
              </div>
              <div class="bi_tit">
                <div class="bi_tit_1">招投标方案</div>
                <div class="bi_tit_2">新建招投标方案</div>
              </div>
            </div>
          </div>
        </el-card>
      </div>
      <div class="box_item">
        <el-card class="bi_card">
          <div class="bic_t bic_t_ztb_bg">新建流程 - 某某方案</div>
          <div class="bic_b">
            <div class="bic_b_c">
              <div class="bi_icon">
                <img class="bi_icon_img" src="../../assets/images/zhaotoubiaoIcon.png">
              </div>
              <div class="bi_tit">
                <div class="bi_tit_1">某某方案</div>
                <div class="bi_tit_2">新建某某方案</div>
              </div>
            </div>
          </div>
        </el-card>
      </div>
    </div>
  </div>
</template>
<script>
import { EmbodimentCreate } from '@/api/api'
import nav from "../../components/navigation";
export default {
  components: {
    Nav: nav
  },
  data () {
    return {

    };
  },
  methods: {
    
  },
};
</script>
<style lang="less" scoped>
.box {
  width: 100%;
  min-width: 980px;
  .box_item {
    width: 22.5%;
    height: 220px;
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
    .bi_card {
      width: 100%;
      height: 100%;
      /deep/ .el-card__body {
        padding: 0;
      }
      .bic_t {
        height: 50px;
        color: #FFFFFF;
        line-height: 50px;
        font-size: 17px;
        font-weight: bold;
        padding-left: 24px;
      }
      .bic_b {
        height: 170px;
        display: flex;
        justify-content: center;
        align-items: center;
        .bic_b_c {
          width: 75%;
          height: 80px;
          display: flex;
          cursor: pointer;
          .bi_icon {
            width: 33%;
            height: 80px;
            display: flex;
            justify-content: center;
            align-items: center;
          }
          .bi_tit {
            width: 67%;
            height: 80px;
            overflow: hidden;
            .bi_tit_1 {
              color: #353535;
            }
            .bi_tit_2 {
              color: #888888;
            }
          }
        }
        .bic_b_c:hover {
          text-decoration: underline;
        }
      }
    }
  }
}
@media screen and (max-width: 1366px) {
  .bi_icon_img {
    display: inline-block;
    width: 36px;
    height: 36px;
  }
  .bi_tit_1 {
    font-size: 16px;
    margin-top: 16px;
  }
  .bi_tit_2 {
    font-size: 14px;
    margin-top: 6px;
  }
}
@media screen and (min-width: 1367px) {
  .bi_icon_img {
    display: inline-block;
    width: 45px;
    height: 45px;
  }
  .bi_tit_1 {
    font-size: 18px;
    margin-top: 13px;
  }
  .bi_tit_2 {
    font-size: 16px;
    margin-top: 7px;
  }
}
@media screen and (min-width: 1679px) {
  .bi_icon_img {
    display: inline-block;
    width: 60px;
    height: 60px;
  }
  .bi_tit_1 {
    font-size: 21px;
    margin-top: 8px;
  }
  .bi_tit_2 {
    font-size: 18px;
    margin-top: 8px;
  }
}
.bic_t_ss_bg {
  background: url('../../assets/images/shishiIcon_bg.png') no-repeat;
  background-size: 100% 100%;
}
.bic_t_sj_bg {
  background: url('../../assets/images/shejiIcon_bg.png') no-repeat;
  background-size: 100% 100%;
}
.bic_t_ztb_bg {
  background: url('../../assets/images/zhaotoubiaoIcon_bg.png') no-repeat;
  background-size: 100% 100%;
}
</style>